import React from 'react';
import { Route, Switch } from 'react-router-dom';
import { lazy, Suspense } from 'react'
import Loading from '@/components/Loading'
import styled from 'styled-components';

const welcome = lazy(() => import('@/views/dashboard/Welcome'));
const User = lazy(() => import('@/views/dashboard/user/Index'));
const Cinema = lazy(() => import('@/views/dashboard/cinema/Index'));
const Film = lazy(() => import('@/views/dashboard/film/Index'));
const College = lazy(() => import('@/views/dashboard/college/Index'))


// const MainBox = styled.div`
//    overflow: auto;
// `
const Main = () => {
    return (
        <Switch>
            <Suspense fallback={<Loading />}>

                <Route path='/dashboard/welcome' component={welcome}></Route>
                <Route path='/dashboard/user/index' component={User}></Route>
                <Route path='/dashboard/cinema/index' component={Cinema}></Route>
                <Route path='/dashboard/film/index' component={Film}></Route>
                <Route path='/dashboard/college/index' component={College}></Route>
            </Suspense>
        </Switch>

    );
}

export default Main;
